<template>
	<view class="pl-30 pr-30">
		<view class="flex flex-column align-center bg-white border-radius-10 padding-30">
			<text class="fsize-30">{{ orderdes.ordertype === 2 ? '取餐号' : '桌号' }}</text>
			<text class="fsize-60 fweigh-600 mt-30">{{ orderdes.ordertype === 2 ? orderdes.orderNo : orderdes.deskName }}</text>
			<!-- <view class="mt-30 w-100">
				<u-steps :current="stepActive" activeColor="#F3C45D">
					<u-steps-item v-for="(ste, ix) in stepList" :key="ix" :title="ste.title"></u-steps-item>
				</u-steps>
			</view> -->
		</view>

		<!-- 产品列表 begin-->
		<view class="bg-white border-radius-10 mt-30 padding-30">
			<view class="flex flex-column">
				<text class="fszie-28 fweigh-600">{{ orderdes.storeName || stock.storeName }}</text>
				<!-- <text class="fsize-24 line-gray mt-12">{{orderdes.address}}</text> -->
			</view>
			<view class="mt-30 pt-30 border-t">
				<view class="flex mb-30" v-for="(item, _index) in orderdes.foodData" :key="_index">
					<image class="width-88 height-88 shrink0" :src="item.foodImage"></image>
					<view class="ml-10 w-100">
						<view class="fweigh-500 fsize-28">{{ item.foodName }}</view>
						<view class="fsize-24 line-gray mt-5">{{ item.specName }} {{ item.feedTasteNames || '' }}</view>
					</view>
					<view class="ml-10 shrink0 flex flex-column justify-between align-end">
						<view>
							<text class="fsize-20">￥</text>
							<!-- <text class="fsize-28" v-if="!deskId">{{ item.realPrice }}</text> -->
							<text class="fsize-28">{{ item.allAmount }}</text>
						</view>
						<view class="line-gray fsize-26">x{{ item.quantity }}</view>
					</view>
				</view>
				<view class="border-t pt-30 text-align-right">
					<text class="fsize-26">共{{ orderdes.foodData.length }}件商品，合计</text>
					<text class="ml-10 fsize-30 fweigh-600">￥</text>
					<text class="fsize-40 fweigh-600">{{ orderdes.sumAllAmount }}</text>
				</view>
			</view>
		</view>
		<!-- 产品列表 end -->
		<!-- 其他信息 begin-->
		<view class="bg-white border-radius-10 mt-30 pt-20 pb-20 pl-30 pr-30">
			<view class="flex justify-between align-center fweigh-600 fsize-32 pt-20 pb-20">
				<text class="line-gray">订单编号</text>
				<text>{{ orderdes.orderNo }}</text>
			</view>
			<view v-if="orderdes.stateName" class="flex justify-between align-center fsize-26 pt-20 pb-20">
				<text class="line-gray">支付状态</text>
				<text>{{ orderdes.stateName }}</text>
			</view>
			<view v-if="orderdes.paymentName" class="flex justify-between align-center fsize-26 pt-20 pb-20">
				<text class="line-gray">支付方式</text>
				<text>{{ orderdes.paymentName }}</text>
			</view>
			<view class="flex justify-between align-center fsize-26 pt-20 pb-20">
				<text class="line-gray">下单时间</text>
				<text>{{ orderdes.orderDate }}</text>
			</view>
			<view class="flex justify-between align-center fsize-26 pt-20 pb-20">
				<text class="line-gray">订单类型</text>
				<text>{{ orderdes.ordertype === 2 ? '外带订单' : '堂食订单' }}</text>
			</view>
		</view>
		<view class="mt-50">
			<u-button plain v-if="orderdes.status === 0 && !deskId" color="#F3C35C" text="立即支付" @click="onPayment(orderdes.orderId, orderdes.classId)"></u-button>
		</view>
		<!-- 其他信息 end -->
		<u-toast ref="uToast" />
	</view>
</template>

<script>
import { mapState } from 'vuex';
// import { requestPayment } from '@/utils/payment'
import { pay } from '@/common/util.js';
import common from '@/common/util.js';
export default {
	data() {
		return {
			deskId: 0,
			orderdes: {
				foodData: []
			},
			stepActive: 0,
			total: 0,
			type: 1,
			stepList: [{ title: '已下单' }, { title: '配餐中' }, { title: '已完成' }]
		};
	},
	computed: {
		...mapState(['stock'])
	},
	onLoad(options) {
		// console.log(options)
		this.type = options.type;
		this.deskId = uni.getStorageSync('deskId');
		if (options.type) {
			this.getData(options.orderId, options.deskId || 0, options.type, options.orderIdStr);
			return;
		}
		// this.orderdes = JSON.parse(decodeURIComponent(options.orderdes))
		this.getData(options.orderId);
	},
	onShow() {
		this.deskId = uni.getStorageSync('deskId');
	},
	methods: {
		async getData(orid, deid, type, oridStr) {
			if (!this.deskId) {
				let _that = this;
				_that.$api.GetOrderDetail({ orderId: orid }).then((res) => {
					_that.orderdes = res.data;
					_that.total = _that.sum(_that.orderdes.foodData);
				});
			} else {
				// console.log(orid,deid,type);
				const res = await this.$api.getDeskOrderDetail({
					orderId: orid.toString(),
					deskId: deid,
					type: type,
					orderIdStr: oridStr
				});
				// console.log(res);
				this.orderdes = res.data;
			}
		},
		sum(list) {
			if (list && list.length > 0) {
				let sum = 0;
				list.filter((im) => {
					sum += Number(im.quantity);
				});
				return sum;
			} else {
				return 0;
			}
		},
		onPayment(orderId, classId) {
			const payMethods = common.getSystemInfo().hostName === 'alipay' ? 'alipay' : 'wechatpay';
			pay(orderId, payMethods, classId);
			// this.$api.OrderPay({ids: orderId, payment_code: 'wechatpay', payment_type:17, params:{}}).then(respay=>{
			// 	const params = respay.data.respData
			// 	requestPayment(params).then(res=>{
			// 		this.$refs.uToast.show({
			// 			message: res,
			// 			complete() {
			// 				// this.getData(orderId)
			// 			}
			// 		})
			// 	}).catch(err=>{
			// 		this.$refs.uToast.show({
			// 			message: err
			// 		})
			// 	})
			// })
		}
	}
};
</script>
